<%@ page contentType="text/html;charset=utf-8" language="java" %>
<%@ include file="/WEB-INF/views/common/taglibs.jsp" %>
<html>
<!-- BEGIN HEAD -->
<head>
    <title>当前直播</title>
    <!-- BEGIN GLOBAL MANDATORY STYLES -->
    <%-- <link href="${ctx}/static/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
     <link href="${ctx}/static/css/bootstrap-responsive.min.css" rel="stylesheet" type="text/css"/>
     <link href="${ctx}/static/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
     <link href="${ctx}/static/css/style-metro.css" rel="stylesheet" type="text/css"/>
     <link href="${ctx}/static/css/style.css" rel="stylesheet" type="text/css"/>
     <link href="${ctx}/static/css/style-responsive.css" rel="stylesheet" type="text/css"/>
     <link href="${ctx}/static/css/default.css" rel="stylesheet" type="text/css" id="style_color"/>
     <link href="${ctx}/static/css/uniform.default.css" rel="stylesheet" type="text/css"/>
     <link href="${ctx}/static/css/halflings.css" rel="stylesheet" type="text/css"/>--%>
    <!-- END GLOBAL MANDATORY STYLES -->
    <!-- BEGIN PAGE LEVEL STYLES -->
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/bootstrap-fileupload.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/chosen.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/lib/select2/select2.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/lib/select2/select2_metro.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/jquery.tagsinput.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/clockface.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/bootstrap-wysihtml5.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/datepicker.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/timepicker.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/colorpicker.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/lib/toggle.buttons/bootstrap-toggle-buttons.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/daterangepicker.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/datetimepicker.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/css/multi-select-metro.css"/>
    <!-- END PAGE LEVEL STYLES -->

    <!-- BEGIN PAGE LEVEL STYLES -->
    <link rel="stylesheet" type="text/css" href="${ctx}/static/lib/jquery.gritter/jquery.gritter.css"/>
    <link rel="stylesheet" type="text/css" href="${ctx}/static/lib/bootstrap.modal/bootstrap-modal.css"/>
    <link rel="stylesheet" type="text/css"
          href="${ctx }/static/assets-sentir/plugins/datatable/css/bootstrap.datatable.min.css" rel="stylesheet">

    <!-- END PAGE LEVEL STYLES -->
    <!-- BEGIN PAGE LEVEL PLUGINS -->
    <script type="text/javascript"
            src="${ctx }/static/assets-sentir/plugins/datatable/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript"
            src="${ctx }/static/assets-sentir/plugins/datatable/js/bootstrap.datatable.js"></script>
    <script type="text/javascript" src="${ctx}/static/lib/backdone/underscore-min.js"></script>
    <script type="text/javascript" src="${ctx}/static/lib/jquery.gritter/jquery.gritter.js"></script>
    <script type="text/javascript" src="${ctx}/static/lib/jquery.validation/jquery.validate.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/lib/bootstrap.modal/bootstrap-modal.js"></script>
    <script type="text/javascript" src="${ctx}/static/lib/bootstrap.modal/bootstrap-modalmanager.js"></script>
    <script type="text/javascript" src="${ctx}/static/lib/require/require.js"></script>

    <script type="text/javascript" src="${ctx}/static/js/bootstrap-datepicker.js"></script>
    <script type="text/javascript" src="${ctx}/static/js/bootstrap-datetimepicker.js"></script>
    <script type="text/javascript" src="${ctx}/static/lib/toggle.buttons/jquery.toggle.buttons.js"></script>
    <script type="text/javascript" src="${ctx}/static/js/clockface.js"></script>
    <script type="text/javascript" src="${ctx}/static/js/date.js"></script>
    <script type="text/javascript" src="${ctx}/static/js/daterangepicker.js"></script>
    <script type="text/javascript" src="${ctx}/static/js/bootstrap-colorpicker.js"></script>
    <script type="text/javascript" src="${ctx}/static/lib/uploadify/js/jquery.uploadify.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/js/jquery.danmu.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/lib/select2/select2.min.js"></script>
    <script type="text/javascript" src="${ctx}/static/lib/select2/select2_locale_zh-CN.js"></script>
    <script type="text/javascript" src="${ctx}/static/lib/city/jquery.proAndCity.js"></script>
    <!-- END PAGE LEVEL PLUGINS -->
    <!-- BEGIN PAGE LEVEL SCRIPTS -->
    <script type="text/javascript" src="${ctx}/static/js/app.js"></script>
    <!-- END PAGE LEVEL SCRIPTS -->
    <script type="text/javascript">
        jQuery(function () {

            App.init({ctx: "${ctx}", fileHost: "${fileHost}"});

            // 因jsp冲突，将模板匹配字符改为{{}}
            _.templateSettings = {
                evaluate: /\{\{([\s\S]+?)\}\}/g,
                interpolate: /\{\{=([\s\S]+?)\}\}/g,
                escape: /\{\{-([\s\S]+?)\}\}/g
            };

            require.config({
                baseUrl: "${ctx}/static/",
                paths: {'jquery': 'js/jquery-1.10.1.min'},
                shim: {}
            });

            require(['pagejs/video/live'], function (Live) {
                var live = new Live({
                    host: "${ctx}"
                });
                live.show();
            });

        });
    </script>
    <script id="temp_op" type="text/template">
        <span data-sign="{{=sign}}" data-id="{{=id}}" data-name="{{=name}}">
            {{ _.each(ops, function(op){ }}
            <a href="javascript:void(0);" class="btn {{=op.color}}" data-sign="{{=op.sign}}" data-id="{{=op.id}}"
               data-toggle="{{=op.modal}}" data-target="{{=op.defaultModal}}"
               data-name="{{=op.name}}">{{=op.btnName}}</a>
            {{ }); }}
        </span>
    </script>

</head>
<body>
<!-- BEGIN PAGE CONTAINER-->
<div>
    <%--按钮弹出框--%>
    <div class="row">
        <div class="col-sm-6">
            <!-- Modal -->
            <div class="modal fade" id="dispatchModal" tabindex="-1" role="dialog" aria-labelledby="DefaultModalLabel"
                 aria-hidden="true">
                <div class="modal-dialog" style="width: 400px;">
                    <div class="modal-content">
                        <div class="modal-body">
                            <div class="col-sm-6" style="width:100%;">
                                <!-- BEGIN TASK LIST -->
                                <div class="panel panel-primary panel-square panel-no-border task-list-wrap">
                                    <div class="panel-heading lg">
                                        <h3 class="panel-title"><input id="task-0" type="checkbox">&nbsp;&nbsp;调度列表</h3>
                                    </div>
                                    <ul class="list-group">
                                        <li class="list-group-item">
                                            <div style="overflow: auto;">
                                                <div class="checkbox" style="width: 50%;float: left">
                                                    <input id="task-1" class="task" type="checkbox" value="1000">
                                                    <label for="task-1">&nbsp;中国</label>
                                                </div>
                                                <div class="checkbox" style="width: 50%;float: left;margin-top: 10px;">
                                                    <input id="task-2" class="task" type="checkbox" value="1001">
                                                    <label for="task-2">&nbsp;美国</label>
                                                </div>
                                            </div>
                                        </li>
                                        <li class="list-group-item">
                                            <div style="overflow: auto;">
                                                <div class="checkbox" style="width: 50%;float: left">
                                                    <input id="task-3" class="task" type="checkbox" value="1002">
                                                    <label for="task-3">&nbsp;俄国</label>
                                                </div>
                                                <div class="checkbox" style="width: 50%;float: left;margin-top: 10px;">
                                                    <input id="task-4" class="task" type="checkbox" value="1003">
                                                    <label for="task-4">&nbsp;印度</label>
                                                </div>
                                            </div>
                                        </li>

                                    </ul>
                                    <textarea class="note-codable" style="width: 100%;color:#AAB2BD;"
                                              placeholder="请输入调度备注"></textarea>

                                    <div class="panel-footer">
                                        <p>
                                            <button id="dispatch" class="btn btn-info btn-perspective btn-block"
                                                    data-id="" data-name="">保存
                                            </button>
                                        </p>
                                        <p>
                                            <button id="cancel" class="btn btn-default btn-perspective btn-block"
                                                    data-dismiss="modal">取消
                                            </button>
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>

    <div id="content_live_list" data-sign="content" class="span12">
        <div class="portlet box blue">
            <div id="form_live_search" class="form-inline">

                <input type="hidden" name="search_videoType" value="${videoType}" readonly="true">

                <div class="btn-group">
                    <select class="form-control" name="country" id="selectCountry">
                        <option value="">-- 选择国家 --</option>
                        <option value="1000">中国</option>
                        <option value="1001">美国</option>
                        <option value="1002">俄国</option>
                        <option value="1003">印度</option>
                    </select>
                </div>
                <input type="text" name="search_videoTitle" class="form-control" placeholder="标题">
                <button id="btn_search" type="button" class="btn btn-primary">搜索</i>
                </button>
            </div>
            <table id="table_live_list" class="table table-th-block table-primary">
                <thead>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>
    <!-- END TABLE Live-->
    <%--详情--%>
    <div id="content_live_details" data-sign="content">
        <div id="div_live_details">
        </div>
        <div class="form-group">
            <button id="btn_live_back" type="button" class="btn">返回</button>
        </div>
    </div>

    <div id="content_user_edit" data-sign="content" class="span12" style="margin-left: 0px;">
        <div class="portlet box blue">
            <div class="portlet-title">
                <div class="caption"><i class="icon-list-alt"></i>用户信息</div>
            </div>
            <div id="div_user_edit" class="portlet-body form">
            </div>
        </div>
    </div>

    <div id="content_video_cover_edit" data-sign="content" class="span12" style="margin-left: 0px;">
        <div class="portlet box blue">
            <div class="portlet-title">
                <div class="caption"><i class="icon-list-alt"></i>修改封面</div>
            </div>
            <div id="div_video_edit" class="portlet-body form">
            </div>
        </div>
    </div>

    <div id="content_video_record_edit" data-sign="content" class="span12" style="margin-left: 0px;">
        <div class="portlet box blue">
            <div class="portlet-title">
                <div class="caption"><i class="icon-list-alt"></i>新增录播</div>
            </div>
            <div id="div_record_edit" class="portlet-body form">
            </div>
        </div>
    </div>


    <div id="modal_album_con" class="modal hide fade" tabindex="-1" role="dialog"
         aria-labelledby="modal_album_con_title" aria-hidden="true">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
            <h3 id="modal_album_con_title">选择分类</h3>
        </div>
        <div id="modal_menu_con_body" class="modal-body">
        </div>
        <div class="modal-footer">
            <button id="btn_album_close" class="btn" data-dismiss="modal" aria-hidden="true">关闭</button>
        </div>
    </div>

    <!-- END PAGE CONTAINER-->
</div>

</body>
</html>